import React,{ Component , Fragment} from 'react';
import './FreshFruits.css'
import FreshFruitsItem from './FreshFruitsItem'
import { getFreshList } from '../../api/api'
export default class FreshFruits extends Component{
    constructor(props){
        super(props);
        this.state={
            freshFruitsItem:[]
        }
    }

    componentWillMount(){
        getFreshList().then(res=>{
            this.setState({
                freshFruitsItem:[...res.data.message]
            })
            // console.log(res.data)
        })
    }

    getFreshFruit=()=>{
        if(this.state.freshFruitsItem.length>0){
            return this.state.freshFruitsItem.map((item,index)=>{
                return (
                    <FreshFruitsItem
                    id={item.goods_id}
                    key={index}
                    pic={item.goods_thumb}
                    title={item.goods_short_title}
                    discount={item.goods_discount}
                    price={item.goods_now_price}
                    size={item.goods_size}
                />
                )
            })
        }
    }
    render(){
        return(
            <Fragment>
                <div className='fresh-fruits'>
                    <h2 className='fresh-fruits-title'><span>--</span>新鲜水果<span>--</span></h2>
                    <div className='fresh-lists'>
                        {this.getFreshFruit()}
                    </div>
                </div>
            </Fragment>
        )
    }
}